<extend name="Base/common"/>

<block name="head"></block>
<block name="body">
    <script src="http://libs.useso.com/js/jquery/2.1.1/jquery.min.js" type="text/javascript"></script>
    <script type="text/javascript">
        $(".navbar-nav li").eq(3).addClass("active");
    </script>
    <script type="text/javascript">
        var priceAjax='{:U("Home/Index/priceAjax",'','')}';        
    </script>
    <div class="booking_title"><h1>{$tinstru['title']}</h1></div>
        <div class="teach_page" style="background: url(__ROOT__{$tinstru['pic']|get_cover=path}) ">
            {$tinstru['detail']} 
        </div>
    <div class="container">
        <div class="booking_title"><h1>{$CateGoryList['title']}</h1></div>
                 <div class="teach_page">{$CateGoryList['detail']}</div>
        <volist name="courses" id="data">
            <div class="booking_title2">{$data['title']}</div>
            <div class="id" style="display:none;">{$data['id']}</div>
            <div class="row">
                <div class="col-md-7 table_content">
                    <table class="table table-border-blue">
                        <thead>
                         <tr>
                            <notempty name='data.address.0'><th>上課地點</th></notempty>
                            <notempty name='data.num.0'><th>班級人數</th></notempty>
                            <notempty name='data.grade.0'><th>級別</th></notempty>
                            <notempty name='data.time'><th>時間</th></notempty>
                            <notempty name='data.Hallnum.0'> <th>堂數</th></notempty>
                        </tr>
                        </thead>
                        <tbody>
                            <tr>
                        <notempty name='data.address.0'>
                            <td>
                                <select multiple class="form-control table_rowtd" id="adress">
                                    <if condition ="is_array($data['address'])">
                                        <volist name="data.address" id="vo">
                                            <option>{$vo}</option>
                                        </volist>
                                        <else/>
                                        <option>{$data['address']}</option>
                                    </if>
                                </select>
                            </td>
                        </notempty>
                        <notempty name='data.num.0'>
                            <td>
                                <select multiple class="form-control table_rowtd" id="number">
                                    <if condition ="is_array($data['num'])">
                                        <volist name="data['num']" id="vo">
                                            <option>{$vo}</option>
                                        </volist>
                                        <else/>
                                        <option>{$data['num']}</option>
                                    </if>
                                </select>
                            </td>
                        </notempty>
                        <notempty name='data.grade.0'> 
                            <td>
                                <select multiple class="form-control table_rowtd" id="level">
                                    <if condition ="is_array($data['grade'])">
                                        <volist name="data['grade']" id="vo">
                                            <option>{$vo}</option> 
                                        </volist>
                                        <else/>
                                        <option>{$data['grade']}</option>
                                    </if>
                                </select>
                            </td>
                        </notempty>
                        <notempty name='data.time'>
                            <td>
                                <select multiple class="form-control table_rowtd" id="time">
                                    <if condition ="is_array($data['time'])">
                                        <volist name="data['time']" id="vo">
                                            <option>{$vo}</option>
                                        </volist>
                                        <else/>
                                        <option>{$data['time']}</option>
                                    </if>
                                </select>
                            </td>
                        </notempty>
                        <notempty name='data.Hallnum.0'>
                            <td>
                                <select multiple class="form-control table_rowtd" id="class">
                                    <if condition ="is_array($data['Hallnum'])">
                                        <volist name="data['Hallnum']" id="vo">
                                            <option>{$vo}</option>
                                        </volist>
                                        <else/>
                                        <option>{$data['Hallnum']}</option>
                                    </if>
                                </select>
                            </td>
                        </notempty>
                        </tr>
                        </tbody>
                    </table>
                    <b>*{$data['note']}</b>
                    <div class=" text-right price"><span>价格(MOP)：</span><span class="price_num"></span></div>
                </div>
                <br>
                <div class="col-md-5 text-center">
                    <button class="btn btn-large bk-btn_blue" data-toggle="modal" data-target="#myModal_bk">我要预约</button>
                    <div class="shar"><a href="#" title="facebook分享"><i class="fa fa-facebook-square"></i></a><a href="#" title="webchat分享"><i class="fa fa-comments"></i></a></div>
                </div>
            </div>
        </volist>
    </div>

    <!--modal-->
    <div class="modal fade" id="myModal_bk" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                    <h4 class="modal-title text-center" id="myModalLabel">課程預約</h4>
                </div>
                <form id="form1" method="post" action="{:U('Home/Index/appointment','','')}">
                    <div class="modal-body">
                        <dl class="dl-horizontal">
                            <dt>预约课程：</dt>
                            <dd><input type="text" class="course_val input_val" value="" name="course"  /></dd>
                            <dt>上課地點：</dt>
                            <dd><input type="text" class="adress_val input_val" value="" name="address" /></dd>
                            <dt>班級人數：</dt>
                            <dd><input type="text" class="number_val input_val" value="" name="number"/></dd>
                            <dt>級別：</dt>
                            <dd><input type="text" class="level_val input_val" name="level"  value="" ></dd>
                            <dt>堂數：</dt>
                            <dd><input type="text" class="class_val input_val" name="class" value="" /></dd>
                            <dt>時間：</dt>
                            <dd><input type="text" class="time_val input_val" name="time" value="" /></dd>
                            <dt>價格：</dt>
                            <dd><input type="text" class="book_val input_val" name="price" value="" /></dd>
                        </dl>                
                    </div>

                    <div class="modal-body">
                        <p><input type="text" class="form-control" id="username" placeholder="姓名：" value="{:session('menber_auth.ccount')}" name="name"></p>
                             <p><input type="text" class="form-control" id="mobile" value="{:session('menber_auth.tel')}" placeholder="手機：" name="mobile"></p>
                    <p><input type="text" class="form-control" id="mobile" value="{:session('menber_auth.email')}" placeholder="郵箱：" name="email"></p> 
                        <p><input type="text" class="form-control" id="age" value="{:session('menber_auth.age')}" placeholder="年龄：" name="age"></p> 
                       
                    </div>

                    <div class="modal-footer">
                        <a class="btn btn-blue" id="btnsubinstru" style="width: 90%">立即提交</a>
                    </div>
                </form> 
            </div>
        </div>
    </div>
    <block name="footer"></block>           
</block>